import { useRef } from 'react'
import Test from './Test'

// !点击按钮获取 Input 框中的 value

export default function App() {
  // !#1 调用 useRef hook 生成 useRef 引用
  const testCmp = useRef(null)
  const handleClick = () => {
    // !#3 通过 testCmp.current 就能拿到 类组件实例 啦
    // 利用这种特性能做到父传子，和 Vue 一样
    testCmp.current.changeName('elser')
  }
  return (
    <div>
      {/* //!#2 用 testCmp 引用和 input 框的 ref 属性进行绑定 */}
      <Test ref={testCmp} />
      <button onClick={handleClick}>获取内容</button>
    </div>
  )
}
